import React from "react";
import { Drawer } from "antd";

interface DocPreviewProps {
	url: string;
	visible: boolean;
	onClose: () => void;
}

const base64Encode = (str: string) => {
	return window.btoa(encodeURIComponent(str));
};

const getPreviewUrl = (fileUrl: string) => {
	const previewServer = "https://preview.chuangmeng888.com/onlinePreview";
	return `${previewServer}?url=${encodeURIComponent(base64Encode(fileUrl))}`;
};

const DocPreview: React.FC<DocPreviewProps> = ({ url, visible, onClose }) => {
	return (
		<Drawer
			title="文档预览"
			placement="right"
			width="100%"
			onClose={onClose}
			open={visible}
			bodyStyle={{ padding: 0, height: "100%" }}
		>
			<iframe
				src={getPreviewUrl(url)}
				style={{
					width: "100%",
					height: "100%",
					border: "none",
				}}
				title="文档预览"
			/>
		</Drawer>
	);
};

export default DocPreview;
